﻿<%@ Page Title="Create User Page" Language="C#" MasterPageFile="  ~/Template/Site.Master" AutoEventWireup="true" CodeBehind="DetailProduct.aspx.cs" Inherits="EAClient.DetailProduct" %>

<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
   
    <style type="text/css">
        .header {
            float:left;width:100%;margin-top:20px;margin-bottom:30px;
        }
        .image 
        {
            float:left;width:400px;
        }

        .image 
        {
            float:left;width:400px;
        }

        .main_image {
            float:left;
            border:1px solid #CCC;
            width:390px;
            height:350px;

        }

        .main_image img {
            max-width:390px;
            max-height:350px;

        }
        .sub_image {
            width:100%;
            float:left;
            margin-top:4px;
        }

            .sub_image .item {
                margin-right:5px;
                width:50px;
                height:50px;
                border:1px solid #CCC;
                float:left;
                cursor:pointer;
            }

                .sub_image .item img {
                max-width:50px;
                max-height:50px;
                
                }

        .sub_detail {
            float:left;
            width:500px;
        }

        .content {
            float:left;
            width:100%;
            margin-bottom:20px;
        }
.tab{
    color:#494949;
    width:100%;
    margin-top:20px;
}


.tab .title{
    float: left;
    width: 100%;
}

.tab .title .tab_not_choose{
    float: left;
    margin-right: 10px;
    border:1px solid #C6C6C6;
    border-bottom: none;
    background-color:#FFF;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    cursor: pointer;
    padding-top:5px;
    height:18px;
    color:#494949;
}

.tab .title div:hover{
    background-color:#FF7A14;
    color:#FFF;
    border:1px solid #FF7A14;
    border-bottom: none;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;

}

.tab_choose{
    
    background-color:#FF7A14;
        float: left;
    margin-right: 10px;
    border:1px solid #FF7A14;
    border-bottom: none;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    cursor: pointer;
    padding-top:5px;
    height:18px;
    color:#FFF;
}

.tab .title div a{
    padding-left:20px;
    padding-right:20px;
    padding-bottom:1px;
    width: 100%;
}


.tab .content{
    float: left;
    width:100%;
    z-index: 0;
    border:1px solid #CCC;
    border-top:3px solid #FF7A14;
}

.tab .content .block{
    padding:5px;
    text-align: left;
}

        .name_product {
            float:left;width:100%;
            font-weight:bold;
            font-size:15px;
            margin-bottom:5px;
        }

         .price_row {
            float:left;width:100%;
            font-size:12px;
            
            margin-bottom:5px;
        }

         .date {
            float:left;width:100%;
            font-size:12px;
            
            margin-bottom:5px;
        }

         .favourite_control {
            float:left;width:100%;
            font-size:12px;
        }

          .like_control {
            float:left;width:100%;
            font-size:12px;
        }


          
.error{
    margin-top:5px;
    text-align: left;
    height:auto;
    font-size:10px;
}

.error .message{
    margin-bottom: 5px;
    float:left;
    height:auto;
    width:100%;
    color:#D90B08;
    border:1px solid #FF0000;
}
.error .message div{
    margin-bottom: 4px;
    margin-top:4px;
    margin-left:10px;
    margin-right:30px;
    background: url('/Images/error.png') no-repeat top left;
    padding-left:30px;
}


.error .message_alert{
    margin-bottom: 5px;
    float:left;
    height:auto;
    width:100%;
    color:green;
    border:1px solid #A4B690;
    background-color:#EEFFED;
}

.error .message_alert div{
    margin-bottom: 4px;
    margin-top:4px;
    margin-left:10px;
    margin-right:30px;
    background: url('/Images/active_msg.png') no-repeat top left;
    padding-left:30px;
}
</style>
  <%
      if (Attributes.ContainsKey("productTO"))
      {
          EA.DTO.ProductTO productTO = (EA.DTO.ProductTO)Attributes["productTO"];
          List<EA.DTO.ProductImageTO> listImage = (List<EA.DTO.ProductImageTO>)Attributes["listProductImage"];
      
   %>

     <script>
         function rating(){
             var rateId = document.getElementById("rate").value;
             location.href="/DetailProduct.aspx?action=Rating&ID=<%=productTO.ID%>&rate="+rateId;
        }
    </script>

        <div class="header">
            <div class="image">
                <div class="main_image">
                    <%if(listImage.Count>0){
                           %><img id="main_image" src="<%=EAClient.WebPage.PATH_IMAGE + listImage[0].URL %>" />
                     <%} %>
                </div>
                <div class="sub_image">
                    <%
                            for(int i=0;i<listImage.Count;i++){
                    %>
                    <div class="item" onclick="document.getElementById('main_image').src=document.getElementById('img_item_<%=listImage[i].ID %>').src">
                        <img alt="" id="img_item_<%=listImage[i].ID %>" src="<%=EAClient.WebPage.PATH_IMAGE + listImage[i].URL %>" />
                    </div>
                    <%} %>
                </div>
            </div>
            <div class="sub_detail">
                <div class="name_product"><%=productTO.Name %></div>
                <div class="price_row">
                    <table style="padding:5px;width:250px;border:1px solid #CCC;border-collapse:collapse" border="1">
                        <tr style="background-color:#494949;color:#FFF;padding:3px"><td style="padding:3px" colspan="2">Price Details</td></tr>
                        <tr>
                            <td>Current Price:</td>
                            <td class="price"><%=productTO.CurrentPrice %>$</td>
                        </tr>
                        <tr>
                            <td>Floor Price:</td>
                            <td class="price"><%=productTO.FloorPrice %>$</td>
                        </tr>
                        <tr>
                            <td>Step Price:</td>
                            <td class="price"><%=productTO.StepPrice %>$</td>
                        </tr>
                    </table>
                </div>
                <div class="date">
                    Start auction from <%= productTO.BeginDate != null ? productTO.BeginDate.ToString("dd/MM/yyyy hh:mm") : "Not start" %>, Total bid date: <%=productTO.TotalBidDay %>
                </div>
                <div class="favourite">
                      <% for (int j = 0; j < productTO.BuyerRating; j++)
                                                   { %>
												    <img src="Images/rating_on.png" alt="*"/>
                                                <%} %>
                                                <% for (int j = 0; j < 5 -productTO.BuyerRating; j++)
                                                   { %>
												    <img src="Images/rating_off.png" alt="*"/>
                                                <%} %>
                </div>
                <div class="like_control">
                        <% 
                            Boolean isLiked = (Boolean)Attributes["isLiked"];
                            if(Session["email"]!=null && !isLiked){ %>
                            <input type="button" onclick="location.href='/DetailProduct.aspx?action=InsertLike&ID=<%=productTO.ID%>'" value="Like"/> 
                        <%} %>
                        <%=productTO.TotalLike %>
                         <img src="Images/like_button.png" alt=""/> 
                    </div>
                <div class="favourite_control">
                        <% 
                            Boolean isEndTime = (Boolean)Attributes["isEndTime"];
                            int BuyerId = (int)Attributes["BuyerId"];
                            if (Session["email"] != null && isEndTime && (int)Session["USER_ID"] == BuyerId && (productTO.BuyerRating == null || productTO.BuyerRating == 0) && BuyerId != 0)
                            { %>
                        <input type="button" onclick="rating()" value="Rating"/> 
                        <select id="rate" name="rate">
                            <option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option>
                        </select>
                        <%} %>
                </div>
            </div>
        </div>
      <div class="error">
                    <%if (Request["error"]!=null){ %>
                    <div class="message">
                        <div><%=Request["error"]%></div>
                    </div>
                    <%} %>
                    <%if (Request["msg"]!=null)
                      { %>
                    <div class="message_alert">
                        <div><%=Request["msg"]%></div>
                    </div>
                    <%} %>
                </div>
         <div class="content">   
              <div class="tab">
                            <div class="title" >
                                <div id="tab_title1" class="tab_choose" onclick="this.className='tab_choose';document.getElementById('tab_title2').className='tab_not_choose' ;document.getElementById('tab_content1').style.display='';document.getElementById('tab_content2').style.display='none';
                                    document.getElementById('tab_title3').className='tab_not_choose' ;document.getElementById('tab_content3').style.display='none';">
                                    <a>Details of Product</a>
                                </div>
                                <div id="tab_title2" class="tab_not_choose" onclick="this.className='tab_choose';document.getElementById('tab_title1').className='tab_not_choose'; document.getElementById('tab_content2').style.display='';document.getElementById('tab_content1').style.display='none';
                                    document.getElementById('tab_title3').className='tab_not_choose' ;document.getElementById('tab_content3').style.display='none';">
                                    <a>History & Auction</a>
                                </div>
                                <div id="tab_title3" class="tab_not_choose" onclick="this.className='tab_choose';document.getElementById('tab_title1').className='tab_not_choose'; document.getElementById('tab_content3').style.display='';document.getElementById('tab_content1').style.display='none';
                                    document.getElementById('tab_title2').className='tab_not_choose' ;document.getElementById('tab_content2').style.display='none';">
                                 <% if (Attributes.ContainsKey("customer"))
                                    {
                                        EA.DTO.CustomerTO customer = (EA.DTO.CustomerTO)Attributes["customer"];
                                        if (customer.Sellable != 1)
                                        {
                                         %>
                                      <a>Upload Your Product</a>
                                   <% }
                                    } %>
                                </div>
                            </div>


                

                            <div class="content">
                                <div id="tab_content1" class="block">
                                    <%=productTO.Detail %>
                                </div>
                                <div id="tab_content2" style="display:none" class="block">

                                    <% if (Session["email"] != null && !isEndTime)
                                       { %>
                                       Auction Price <%= (productTO.CurrentPrice + productTO.StepPrice) %> <input type="button" onclick="location.href='/DetailProduct.aspx?productId=<%=productTO.ID%>&action=Auction&price=<%=(productTO.CurrentPrice + productTO.StepPrice)%>'" value="Accept" />
                                    <%} %>
                                     <%if (Attributes.ContainsKey("listAuctionLog"))
                      {
                          List<EA.DTO.AuctionLogTO> list = (List<EA.DTO.AuctionLogTO>)Attributes["listAuctionLog"];
                           %>
                                    <table style="width:90%" cellpadding="5px">
                                        <tr style="background-color:#494949;color:#FFF">
                                            <th>Email</th>
                                            <th>Price</th>
                                            <th>Bid Date</th>
                                        </tr>
                                        <%for(int i=0;i<list.Count;i++)
                                          { %>
                                        <tr>
                                            <td><%=list[i].Emails %></td>
                                            <td><%=list[i].Price %></td>
                                            <td><%=list[i].BidDate %></td>
                                        </tr>
                                        <%} %>
                                    </table>
                                    <%} %>
                                </div>
                               <div id="tab_content3" style="display:none" class="block">
                                    <% if(Session["email"]!=null){ %>
                                        <form method="post" action="/DetailProduct.aspx?action=UploadProduct" id="Form1" enctype="multipart/form-data" name="Form1">
                                            <table>
                                                <tr>
                                                    <input type="hidden" id="product_current_id" value="<%=productTO.ID %>" name="product_current_id"/>
                                                    <td>Name: </td><td><input type="text" name="name"/></td>
                                                </tr>
                                                <tr>
                                                    <td>Detail: </td><td>
                                                        <textarea name="detail"></textarea>  </td>
                                                 </tr>
                                                <tr>                   
                                                    <td>Floor Price: </td><td><input type="text" name="fprice"/></td>
                                                 </tr>
                                                <tr>
                                                    <td>Step Price: </td><td><input type="text" name="sprice"/></td>
                                                    
                                                </tr>

                                            </table>
                                            
                                            <input type="file" name="file1"/><br />
                                            <input type="file" name="file2"/><br />
                                            <input type="file" name="file3"/><br />
                                            <input type="file" name="file4"/><br />
                                            (max-size upload <= 200KB)
                                            <input type="submit" value="Submit" />
                                        </form>
                                    <%}else{ %>
                                        <center>You must log on to upload your product</center>
                                    <%} %>
                                </div>
                                
                            </div>
                        </div>
         </div>
      <%} %>
</asp:Content>
